$themebg: #49240f;
$themeColor: #e4a79d;
//flex 混入
@mixin flex($d: column, $j: normal, $a: auto) {
  display: flex;
  flex-direction: $d;
  justify-content: $j;
  align-items: $a;
}
.el-message {
  z-index: 999999 !important;
}
:deep(.el-button) {
  border: none;
}
:deep(.el-loading-mask) {
  background: #000;
  opacity: 0.7;
}
:deep(.el-loading-spinner .path) {
  stroke: #048664;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s ease-out;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}
.page-enter-active,
.page-leave-active {
  transition: all 0.4s;
}
.page-enter-from,
.page-leave-to {
  opacity: 0;
  filter: blur(1rem);
}
.slide-left-enter-active,
.slide-left-leave-active,
.slide-right-enter-active,
.slide-right-leave-active {
  transition: all 0.2s;
}
.slide-left-enter-from {
  opacity: 0;
  transform: translate(50px, 0);
}
.slide-left-leave-to {
  opacity: 0;
  transform: translate(-50px, 0);
}
.slide-right-enter-from {
  opacity: 0;
  transform: translate(-50px, 0);
}
.slide-right-leave-to {
  opacity: 0;
  transform: translate(50px, 0);
}
img[src=''],img:not([src]){
  opacity: 0;
}
img[lazy="loading"] {
  width: 100%;
  height: 100%;
  background: url("~/assets/img/loadingimg2.png") no-repeat;
  background-size: 40px 32px;
  background-position: center;
  // z-index: -1;
}


.el-picker-panel,
.el-picker-panel__sidebar,
.el-picker__popper,
.el-date-range-picker,
.has-sidebar,
.el-picker-panel__footer,
.has-time,
.el-picker-panel__shortcut {
  background-image: linear-gradient(#1c1e22, #1c1e22),
    linear-gradient(#fff, #fff) !important;
  background-blend-mode: normal, normal !important;
  color: #fff !important;
  border: none !important;

  .el-input__wrapper {
    background-color: rgb(39, 42, 48) !important;
    border-radius: 8px !important;
    border: 1px solid rgb(74, 76, 83) !important;
    box-shadow: none !important;
    color: #fff !important;
  }

  .el-input__inner {
    color: #fff !important;
  }

  .el-time-panel,
  .el-scrollbar__view,
  .el-time-spinner__item,
  .has-seconds,
  .el-time-panel__content,
  .el-time-panel__footer {
    background-color: rgb(28, 30, 34) !important;
    box-shadow: none !important;
    border: none !important;
  }
  .available,
  .el-date-table-cell,
  .el-date-table-cell__text {
    &:hover {
      color: #fff !important;
    }
  }

  .cancel,
  .is-text {
    color: #fff !important;
  }

  .in-range {
    .el-date-table-cell {
      background-color: #0a906c !important;
    }

    .el-date-table-cell__text {
      background-color: #0a906c !important;
      color: #fff !important;
    }
  }

  .start-date,
  .end-date {
    .el-date-table-cell {
      background-color: #0a906c !important;
    }

    .el-date-table-cell__text {
      background-color: #0a906c !important;
      color: #fff !important;
    }
  }

  .today {
    .el-date-table-cell__text {
      color: #0a906c !important;
    }
  }

  .in-range {
    .el-date-table-cell {
      background-color: #0a906c !important;
    }

    .el-date-table-cell__text {
      background-color: #0a906c !important;
      color: #fff !important;
      font-weight: bold;
    }
  }

  .is-plain {
    background-color: #0a906c !important;
    color: #fff !important;
    border-color: #0a906c !important;
  }

  .confirm {
    color: #0a906c !important;
  }

  .el-time-spinner__item {
    color: #fff !important;
  }
}
.el-date-editor,
.el-date-editor--datetimerange,
.el-input__wrapper {
  background-color: rgb(39, 42, 48) !important;
  height: 32px !important;
  border-radius: 8px !important;
  border: 1px solid rgb(74, 76, 83) !important;
  box-shadow: none !important;
}

.el-range-input {
  color: #fff !important;
}

.el-date-editor--datetimerange.is-active {
  border-color: #0a906c !important;
  color: #0a906c !important;
}

.el-tooltip__trigger {
  border-color: #0a906c !important;
  color: #0a906c !important;
}

.datetimerange {
  height: 40px !important;
  background-color: rgb(39, 42, 48) !important;
  border: 1px solid rgb(74, 76, 83) !important;
  .el-picker-panel__body-wrapper,
  .el-picker-panel,
  .el-picker-panel__footer,
  .el-date-picker,
  .el-time-panel,
  .el-popper__arrow::before {
    background-color: rgb(29, 30, 34) !important;
    border: none !important;
    box-shadow: none !important;
    border: 1px solid rgb(74, 76, 83) !important;
    outline: none !important;
  }
}
